﻿@using Covenant.Models.Listeners
@model Profile
@{
    Layout = "../Listener/_ListenerLayout";
    ViewData["Title"] = "Profile";
}

<div class="d-flex justify-content-between flex-wrap flex-md-nowrap pb-2 mb-3">
    <h1 class="h2">Profile: <span id="task-name" class="text-primary">@Html.DisplayFor(model => model.Name)</span></h1>
</div>

@if (Model.Type == ProfileType.HTTP)
{
    await Html.RenderPartialAsync("_EditHttpProfile", Model);
}
else if (Model.Type == ProfileType.Bridge)
{
    await Html.RenderPartialAsync("_EditBridgeProfile", Model);
}

@section Scripts {
<script type="text/javascript">
    $(document).ready(function () {
        var editors = [];
        $(".code-mirror-csharp").each(function () {
            editors.push(CodeMirror.fromTextArea(this, {
                lineNumbers: true,
                mode: "text/x-csharp"
            }));
        });
        $(".code-mirror-html").each(function () {
            editors.push(CodeMirror.fromTextArea(this, {
                lineNumbers: true,
                mode: "htmlmixed"
            }));
        });

        var addUrl = function () {
            var num = $(".httpurl-row").length;
            var newitem = '<div class="form-row httpurl-row">' +
                          '    <div class="form-group col-md-6">' +
                          '        <input id="HttpUrls_' + num + '_" name="HttpUrls[' + num + ']" class="form-control" type="text">' +
                          '    </div>' +
                          '    <div class="col-auto align-self-center">' +
                          '        <button type="button" class="btn btn-outline-danger btn-sm xbutton remove-httpurl-button"><span data-feather="x"></span></button>' +
                          '    </div>' +
                          '</div>';
            $(this).before(newitem);
            feather.replace();
            console.log($(this).prev().find("button"));
            $(this).prev().find("button").click(removeUrl);
        }
        var addRequest = function () {
            var num = $(".httprequestheader-row").length;
            var newitem = '<div class="form-row httprequestheader-row">' +
                          '    <div class="form-group col-md-6">' +
                          '        <label for="HttpRequestHeaders_' + num + '__Name">Name</label>' +
                          '        <input id="HttpRequestHeaders_' + num + '__Name" name="HttpRequestHeaders[' + num + '].Name" class="form-control" type="text">' +
                          '        <label for="HttpRequestHeaders_' + num + '__Value">Value</label>' +
                          '        <input id="HttpRequestHeaders_' + num + '__Value" name="HttpRequestHeaders[' + num + '].Value" class="form-control" type="text">' +
                          '    </div>' +
                          '    <div class="col-auto align-self-center">' +
                          '        <button type="button" class="btn btn-outline-danger btn-sm xbutton remove-httprequestheader-button"><span data-feather="x"></span></button>' +
                          '    </div>' +
                          '</div>';
            $(this).before(newitem);
            feather.replace();
            $(this).prev().find("button").click(removeRequest);
        }
        var addResponse = function () {
            var num = $(".httpresponseheader-row").length;
            var newitem = '<div class="form-row httpresponseheader-row">' +
                          '    <div class="form-group col-md-6">' +
                          '        <label for="HttpResponseHeaders_' + num + '__Name">Name</label>' +
                          '        <input id="HttpResponseHeaders_' + num + '__Name" name="HttpResponseHeaders[' + num + '].Name" class="form-control" type="text">' +
                          '        <label for="HttpResponseHeaders_' + num + '__Value">Value</label>' +
                          '        <input id="HttpResponseHeaders_' + num + '__Value" name="HttpResponseHeaders[' + num + '].Value" class="form-control" type="text">' +
                          '    </div>' +
                          '    <div class="col-auto align-self-center">' +
                          '        <button type="button" class="btn btn-outline-danger btn-sm xbutton remove-httpresponseheader-button"><span data-feather="x"></span></button>' +
                          '    </div>' +
                          '</div>';
            $(this).before(newitem);
            feather.replace();
            $(this).prev().find("button").click(removeResponse);
        }

        var removeUrl = function () {
            var row = $(this).parent().parent();
            var num = row.find("input").attr("id").replace("HttpUrls_", "").replace("_", "");
            $(".httpurl-row").each(function()
            {
                var currNum = $(this).find("input").attr("id").replace("HttpUrls_", "").replace("_", "");
                console.log("num: " + parseInt(num));
                console.log("currNum: " + parseInt(currNum));
                if (parseInt(currNum) > parseInt(num)) {
                    $(this).find("input").attr("id", "HttpUrls_" + (parseInt(currNum) - 1) + "_");
                    $(this).find("input").attr("name", "HttpUrls[" + (parseInt(currNum) - 1) + "]");
                }
            });
            row.remove();
        }
        var removeRequest = function () {
            var row = $(this).parent().parent();
            var num = row.find("input").attr("id").replace("HttpRequestHeaders_", "").replace("_", "");
            $(".httprequestheader-row").each(function()
            {
                var currNum = $(this).find("input").attr("id").replace("HttpRequestHeaders_", "").replace("_", "");
                if (parseInt(currNum) > parseInt(num)) {
                    $(this).find("input").attr("id", "HttpRequestHeaders_" + (parseInt(currNum) - 1) + "_");
                    $(this).find("input").attr("name", "HttpRequestHeaders[" + (parseInt(currNum) - 1) + "]");
                }
            });
            row.remove();
        }
        var removeResponse = function () {
            var row = $(this).parent().parent();
            var num = row.find("input").attr("id").replace("HttpResponseHeaders_", "").replace("_", "");
            $(".httpresponseheader-row").each(function()
            {
                var currNum = $(this).find("input").attr("id").replace("HttpResponseHeaders_", "").replace("_", "");
                if (parseInt(currNum) > parseInt(num)) {
                    $(this).find("input").attr("id", "HttpResponseHeaders_" + (parseInt(currNum) - 1) + "_");
                    $(this).find("input").attr("name", "HttpResponseHeaders[" + (parseInt(currNum) - 1) + "]");
                }
            });
            row.remove();
        }
        
        $('#add-httpurl-button').click(addUrl);
        $('#add-httprequestheader-button').click(addRequest);
        $('#add-httpresponseheader-button').click(addResponse);

        $('.remove-httpurl-button').click(removeUrl);
        $('.remove-httprequestheader-button').click(removeRequest);
        $('.remove-httpresponseheader-button').click(removeResponse);
    });
    </script>
}